<script setup lang="ts">
import { ref } from 'vue'
import useStore from '../store'

const name = ref('')
const { todos } = useStore()

const add = () => {
  // 添加
  todos.addTodo(name.value)
  name.value = ''
}
</script>

<template>
  <header class="header">
    <h1>todos</h1>
    <input
      class="new-todo"
      placeholder="What needs to be done?"
      autofocus
      v-model="name"
      @keyup.enter="add"
    />
  </header>
</template>

<style lang="less" scoped></style>

